{extend name="login/parent" /}
{block name="content"}
<div class="tpl-user-login-main">
    <div class="tpl-user-login-box tpl-user-login-header">
        <h2>{$web_name}<span>注册会员</span></h2>
    </div>
    <div class="tpl-user-login-box tpl-user-login-body layui-form">
        <div class="layui-form-item">
            <label class="tpl-user-login-icon layui-icon layui-icon-cellphone"></label>
            <input type="text" name="tel" lay-verify="phone" placeholder="手机" class="layui-input">
        </div>
        <div class="layui-form-item">
            <div class="layui-row">
                <div class="layui-col-xs7">
                    <label class="tpl-user-login-icon layui-icon layui-icon-vercode"></label>
                    <input type="text" name="vercode" lay-verify="required" placeholder="验证码" class="layui-input">
                </div>
                <div class="layui-col-xs5">
                    <div style="margin-left: 10px;">
                        <button type="button" class="layui-btn layui-btn-primary layui-btn-fluid">获取验证码</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="tpl-user-login-icon layui-icon layui-icon-password"></label>
            <input type="password" name="user_pwd" lay-verify="pass" placeholder="密码" class="layui-input">
        </div>
        <div class="layui-form-item">
            <label class="tpl-user-login-icon layui-icon layui-icon-password"></label>
            <input type="password" name="repass" lay-verify="required" placeholder="确认密码" class="layui-input">
        </div>
        <div class="layui-form-item">
            <label class="tpl-user-login-icon layui-icon layui-icon-username"></label>
            <input type="text" name="nickname" lay-verify="nickname" placeholder="帐号/昵称" class="layui-input">
        </div>
        <div class="layui-form-item">
            <input type="checkbox" name="agreement" lay-skin="primary" title="同意用户协议" checked>
        </div>
        <div class="layui-form-item">
            <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="registerSubmit">注 册</button>
        </div>
        <div class="layui-trans layui-form-item tpl-user-login-other">
            <label>快速注册</label>
            <a href="javascript:;"><i class="tpl-icon tpl-icon-login-qq"></i></a>
            <a href="javascript:;"><i class="tpl-icon tpl-icon-login-wechat"></i></a>

            <a href="{:url('index')}" class="tpl-user-jump-change tpl-link layui-hide-xs">已有帐号</a>
        </div>

    </div>
</div>

{/block}
{block name="script"}
<script>
    $(function(){
        layui.config({
            version: '2.2.5'
        }).use(['form'],function(){
            var form = layui.form;

            form.render();

            //提交
            form.on('submit(registerSubmit)', function(obj){
                var field = obj.field;

                //确认密码
                if(field.user_pwd !== field.repass){
                    return layer.msg('两次密码输入不一致');
                }

                //是否同意用户协议
                if(!field.agreement){
                    return layer.msg('你必须同意用户协议才能注册');
                }
                return false;
            });
        });
    });
</script>
{/block}